export default function (module, exports, __webpack_require__) {


    /*
    * Licensed to the Apache Software Foundation (ASF) under one
    * or more contributor license agreements.  See the NOTICE file
    * distributed with this work for additional information
    * regarding copyright ownership.  The ASF licenses this file
    * to you under the Apache License, Version 2.0 (the
    * "License"); you may not use this file except in compliance
    * with the License.  You may obtain a copy of the License at
    *
    *   http://www.apache.org/licenses/LICENSE-2.0
    *
    * Unless required by applicable law or agreed to in writing,
    * software distributed under the License is distributed on an
    * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
    * KIND, either express or implied.  See the License for the
    * specific language governing permissions and limitations
    * under the License.
    */

    var zrUtil = __webpack_require__("6d8b");

    var graphic = __webpack_require__("2306");

    var layoutUtil = __webpack_require__("f934");

    var LegendView = __webpack_require__("5e970");

    /*
    * Licensed to the Apache Software Foundation (ASF) under one
    * or more contributor license agreements.  See the NOTICE file
    * distributed with this work for additional information
    * regarding copyright ownership.  The ASF licenses this file
    * to you under the Apache License, Version 2.0 (the
    * "License"); you may not use this file except in compliance
    * with the License.  You may obtain a copy of the License at
    *
    *   http://www.apache.org/licenses/LICENSE-2.0
    *
    * Unless required by applicable law or agreed to in writing,
    * software distributed under the License is distributed on an
    * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
    * KIND, either express or implied.  See the License for the
    * specific language governing permissions and limitations
    * under the License.
    */

    /**
     * Separate legend and scrollable legend to reduce package size.
     */
    var Group = graphic.Group;
    var WH = ['width', 'height'];
    var XY = ['x', 'y'];
    var ScrollableLegendView = LegendView.extend({
        type: 'legend.scroll',
        newlineDisabled: true,
        init: function () {
            ScrollableLegendView.superCall(this, 'init');
            /**
             * @private
             * @type {number} For `scroll`.
             */

            this._currentIndex = 0;
            /**
             * @private
             * @type {module:zrender/container/Group}
             */

            this.group.add(this._containerGroup = new Group());

            this._containerGroup.add(this.getContentGroup());
            /**
             * @private
             * @type {module:zrender/container/Group}
             */


            this.group.add(this._controllerGroup = new Group());
            /**
             *
             * @private
             */

            this._showController;
        },

        /**
         * @override
         */
        resetInner: function () {
            ScrollableLegendView.superCall(this, 'resetInner');

            this._controllerGroup.removeAll();

            this._containerGroup.removeClipPath();

            this._containerGroup.__rectSize = null;
        },

        /**
         * @override
         */
        renderInner: function (itemAlign, legendModel, ecModel, api, selector, orient, selectorPosition) {
            var me = this; // Render content items.

            ScrollableLegendView.superCall(this, 'renderInner', itemAlign, legendModel, ecModel, api, selector, orient, selectorPosition);
            var controllerGroup = this._controllerGroup; // FIXME: support be 'auto' adapt to size number text length,
            // e.g., '3/12345' should not overlap with the control arrow button.

            var pageIconSize = legendModel.get('pageIconSize', true);

            if (!zrUtil.isArray(pageIconSize)) {
                pageIconSize = [pageIconSize, pageIconSize];
            }

            createPageButton('pagePrev', 0);
            var pageTextStyleModel = legendModel.getModel('pageTextStyle');
            controllerGroup.add(new graphic.Text({
                name: 'pageText',
                style: {
                    textFill: pageTextStyleModel.getTextColor(),
                    font: pageTextStyleModel.getFont(),
                    textVerticalAlign: 'middle',
                    textAlign: 'center'
                },
                silent: true
            }));
            createPageButton('pageNext', 1);

            function createPageButton(name, iconIdx) {
                var pageDataIndexName = name + 'DataIndex';
                var icon = graphic.createIcon(legendModel.get('pageIcons', true)[legendModel.getOrient().name][iconIdx], {
                    // Buttons will be created in each render, so we do not need
                    // to worry about avoiding using legendModel kept in scope.
                    onclick: zrUtil.bind(me._pageGo, me, pageDataIndexName, legendModel, api)
                }, {
                    x: -pageIconSize[0] / 2,
                    y: -pageIconSize[1] / 2,
                    width: pageIconSize[0],
                    height: pageIconSize[1]
                });
                icon.name = name;
                controllerGroup.add(icon);
            }
        },

        /**
         * @override
         */
        layoutInner: function (legendModel, itemAlign, maxSize, isFirstRender, selector, selectorPosition) {
            var selectorGroup = this.getSelectorGroup();
            var orientIdx = legendModel.getOrient().index;
            var wh = WH[orientIdx];
            var xy = XY[orientIdx];
            var hw = WH[1 - orientIdx];
            var yx = XY[1 - orientIdx];
            selector && layoutUtil.box( // Buttons in selectorGroup always layout horizontally
                'horizontal', selectorGroup, legendModel.get('selectorItemGap', true));
            var selectorButtonGap = legendModel.get('selectorButtonGap', true);
            var selectorRect = selectorGroup.getBoundingRect();
            var selectorPos = [-selectorRect.x, -selectorRect.y];
            var processMaxSize = zrUtil.clone(maxSize);
            selector && (processMaxSize[wh] = maxSize[wh] - selectorRect[wh] - selectorButtonGap);

            var mainRect = this._layoutContentAndController(legendModel, isFirstRender, processMaxSize, orientIdx, wh, hw, yx);

            if (selector) {
                if (selectorPosition === 'end') {
                    selectorPos[orientIdx] += mainRect[wh] + selectorButtonGap;
                } else {
                    var offset = selectorRect[wh] + selectorButtonGap;
                    selectorPos[orientIdx] -= offset;
                    mainRect[xy] -= offset;
                }

                mainRect[wh] += selectorRect[wh] + selectorButtonGap;
                selectorPos[1 - orientIdx] += mainRect[yx] + mainRect[hw] / 2 - selectorRect[hw] / 2;
                mainRect[hw] = Math.max(mainRect[hw], selectorRect[hw]);
                mainRect[yx] = Math.min(mainRect[yx], selectorRect[yx] + selectorPos[1 - orientIdx]);
                selectorGroup.attr('position', selectorPos);
            }

            return mainRect;
        },
        _layoutContentAndController: function (legendModel, isFirstRender, maxSize, orientIdx, wh, hw, yx) {
            var contentGroup = this.getContentGroup();
            var containerGroup = this._containerGroup;
            var controllerGroup = this._controllerGroup; // Place items in contentGroup.

            layoutUtil.box(legendModel.get('orient'), contentGroup, legendModel.get('itemGap'), !orientIdx ? null : maxSize.width, orientIdx ? null : maxSize.height);
            layoutUtil.box( // Buttons in controller are layout always horizontally.
                'horizontal', controllerGroup, legendModel.get('pageButtonItemGap', true));
            var contentRect = contentGroup.getBoundingRect();
            var controllerRect = controllerGroup.getBoundingRect();
            var showController = this._showController = contentRect[wh] > maxSize[wh];
            var contentPos = [-contentRect.x, -contentRect.y]; // Remain contentPos when scroll animation perfroming.
            // If first rendering, `contentGroup.position` is [0, 0], which
            // does not make sense and may cause unexepcted animation if adopted.

            if (!isFirstRender) {
                contentPos[orientIdx] = contentGroup.position[orientIdx];
            } // Layout container group based on 0.


            var containerPos = [0, 0];
            var controllerPos = [-controllerRect.x, -controllerRect.y];
            var pageButtonGap = zrUtil.retrieve2(legendModel.get('pageButtonGap', true), legendModel.get('itemGap', true)); // Place containerGroup and controllerGroup and contentGroup.

            if (showController) {
                var pageButtonPosition = legendModel.get('pageButtonPosition', true); // controller is on the right / bottom.

                if (pageButtonPosition === 'end') {
                    controllerPos[orientIdx] += maxSize[wh] - controllerRect[wh];
                } // controller is on the left / top.
                else {
                    containerPos[orientIdx] += controllerRect[wh] + pageButtonGap;
                }
            } // Always align controller to content as 'middle'.


            controllerPos[1 - orientIdx] += contentRect[hw] / 2 - controllerRect[hw] / 2;
            contentGroup.attr('position', contentPos);
            containerGroup.attr('position', containerPos);
            controllerGroup.attr('position', controllerPos); // Calculate `mainRect` and set `clipPath`.
            // mainRect should not be calculated by `this.group.getBoundingRect()`
            // for sake of the overflow.

            var mainRect = {
                x: 0,
                y: 0
            }; // Consider content may be overflow (should be clipped).

            mainRect[wh] = showController ? maxSize[wh] : contentRect[wh];
            mainRect[hw] = Math.max(contentRect[hw], controllerRect[hw]); // `containerRect[yx] + containerPos[1 - orientIdx]` is 0.

            mainRect[yx] = Math.min(0, controllerRect[yx] + controllerPos[1 - orientIdx]);
            containerGroup.__rectSize = maxSize[wh];

            if (showController) {
                var clipShape = {
                    x: 0,
                    y: 0
                };
                clipShape[wh] = Math.max(maxSize[wh] - controllerRect[wh] - pageButtonGap, 0);
                clipShape[hw] = mainRect[hw];
                containerGroup.setClipPath(new graphic.Rect({
                    shape: clipShape
                })); // Consider content may be larger than container, container rect
                // can not be obtained from `containerGroup.getBoundingRect()`.

                containerGroup.__rectSize = clipShape[wh];
            } else {
                // Do not remove or ignore controller. Keep them set as placeholders.
                controllerGroup.eachChild(function (child) {
                    child.attr({
                        invisible: true,
                        silent: true
                    });
                });
            } // Content translate animation.


            var pageInfo = this._getPageInfo(legendModel);

            pageInfo.pageIndex != null && graphic.updateProps(contentGroup, {
                position: pageInfo.contentPosition
            }, // When switch from "show controller" to "not show controller", view should be
                // updated immediately without animation, otherwise causes weird effect.
                showController ? legendModel : false);

            this._updatePageInfoView(legendModel, pageInfo);

            return mainRect;
        },
        _pageGo: function (to, legendModel, api) {
            var scrollDataIndex = this._getPageInfo(legendModel)[to];

            scrollDataIndex != null && api.dispatchAction({
                type: 'legendScroll',
                scrollDataIndex: scrollDataIndex,
                legendId: legendModel.id
            });
        },
        _updatePageInfoView: function (legendModel, pageInfo) {
            var controllerGroup = this._controllerGroup;
            zrUtil.each(['pagePrev', 'pageNext'], function (name) {
                var canJump = pageInfo[name + 'DataIndex'] != null;
                var icon = controllerGroup.childOfName(name);

                if (icon) {
                    icon.setStyle('fill', canJump ? legendModel.get('pageIconColor', true) : legendModel.get('pageIconInactiveColor', true));
                    icon.cursor = canJump ? 'pointer' : 'default';
                }
            });
            var pageText = controllerGroup.childOfName('pageText');
            var pageFormatter = legendModel.get('pageFormatter');
            var pageIndex = pageInfo.pageIndex;
            var current = pageIndex != null ? pageIndex + 1 : 0;
            var total = pageInfo.pageCount;
            pageText && pageFormatter && pageText.setStyle('text', zrUtil.isString(pageFormatter) ? pageFormatter.replace('{current}', current).replace('{total}', total) : pageFormatter({
                current: current,
                total: total
            }));
        },

        /**
         * @param {module:echarts/model/Model} legendModel
         * @return {Object} {
         *  contentPosition: Array.<number>, null when data item not found.
         *  pageIndex: number, null when data item not found.
         *  pageCount: number, always be a number, can be 0.
         *  pagePrevDataIndex: number, null when no previous page.
         *  pageNextDataIndex: number, null when no next page.
         * }
         */
        _getPageInfo: function (legendModel) {
            var scrollDataIndex = legendModel.get('scrollDataIndex', true);
            var contentGroup = this.getContentGroup();
            var containerRectSize = this._containerGroup.__rectSize;
            var orientIdx = legendModel.getOrient().index;
            var wh = WH[orientIdx];
            var xy = XY[orientIdx];

            var targetItemIndex = this._findTargetItemIndex(scrollDataIndex);

            var children = contentGroup.children();
            var targetItem = children[targetItemIndex];
            var itemCount = children.length;
            var pCount = !itemCount ? 0 : 1;
            var result = {
                contentPosition: contentGroup.position.slice(),
                pageCount: pCount,
                pageIndex: pCount - 1,
                pagePrevDataIndex: null,
                pageNextDataIndex: null
            };

            if (!targetItem) {
                return result;
            }

            var targetItemInfo = getItemInfo(targetItem);
            result.contentPosition[orientIdx] = -targetItemInfo.s; // Strategy:
            // (1) Always align based on the left/top most item.
            // (2) It is user-friendly that the last item shown in the
            // current window is shown at the begining of next window.
            // Otherwise if half of the last item is cut by the window,
            // it will have no chance to display entirely.
            // (3) Consider that item size probably be different, we
            // have calculate pageIndex by size rather than item index,
            // and we can not get page index directly by division.
            // (4) The window is to narrow to contain more than
            // one item, we should make sure that the page can be fliped.

            for (var i = targetItemIndex + 1, winStartItemInfo = targetItemInfo, winEndItemInfo = targetItemInfo, currItemInfo = null; i <= itemCount; ++i) {
                currItemInfo = getItemInfo(children[i]);

                if ( // Half of the last item is out of the window.
                    !currItemInfo && winEndItemInfo.e > winStartItemInfo.s + containerRectSize || // If the current item does not intersect with the window, the new page
                    // can be started at the current item or the last item.
                    currItemInfo && !intersect(currItemInfo, winStartItemInfo.s)) {
                    if (winEndItemInfo.i > winStartItemInfo.i) {
                        winStartItemInfo = winEndItemInfo;
                    } else {
                        // e.g., when page size is smaller than item size.
                        winStartItemInfo = currItemInfo;
                    }

                    if (winStartItemInfo) {
                        if (result.pageNextDataIndex == null) {
                            result.pageNextDataIndex = winStartItemInfo.i;
                        }

                        ++result.pageCount;
                    }
                }

                winEndItemInfo = currItemInfo;
            }

            for (var i = targetItemIndex - 1, winStartItemInfo = targetItemInfo, winEndItemInfo = targetItemInfo, currItemInfo = null; i >= -1; --i) {
                currItemInfo = getItemInfo(children[i]);

                if ( // If the the end item does not intersect with the window started
                    // from the current item, a page can be settled.
                    (!currItemInfo || !intersect(winEndItemInfo, currItemInfo.s)) && // e.g., when page size is smaller than item size.
                    winStartItemInfo.i < winEndItemInfo.i) {
                    winEndItemInfo = winStartItemInfo;

                    if (result.pagePrevDataIndex == null) {
                        result.pagePrevDataIndex = winStartItemInfo.i;
                    }

                    ++result.pageCount;
                    ++result.pageIndex;
                }

                winStartItemInfo = currItemInfo;
            }

            return result;

            function getItemInfo(el) {
                if (el) {
                    var itemRect = el.getBoundingRect();
                    var start = itemRect[xy] + el.position[orientIdx];
                    return {
                        s: start,
                        e: start + itemRect[wh],
                        i: el.__legendDataIndex
                    };
                }
            }

            function intersect(itemInfo, winStart) {
                return itemInfo.e >= winStart && itemInfo.s <= winStart + containerRectSize;
            }
        },
        _findTargetItemIndex: function (targetDataIndex) {
            if (!this._showController) {
                return 0;
            }

            var index;
            var contentGroup = this.getContentGroup();
            var defaultIndex;
            contentGroup.eachChild(function (child, idx) {
                var legendDataIdx = child.__legendDataIndex; // FIXME
                // If the given targetDataIndex (from model) is illegal,
                // we use defaultIndex. But the index on the legend model and
                // action payload is still illegal. That case will not be
                // changed until some scenario requires.

                if (defaultIndex == null && legendDataIdx != null) {
                    defaultIndex = idx;
                }

                if (legendDataIdx === targetDataIndex) {
                    index = idx;
                }
            });
            return index != null ? index : defaultIndex;
        }
    });
    var _default = ScrollableLegendView;
    module.exports = _default;


}